<template>
  <div
    class="app-container"
    style="min-height: calc(100vh - 100px); background-color: #fff"
  >
    <div class="headerBox" style="margin-bottom: 18px">
      <div>
        <div class="b" style="font-size: 18px">患者信息</div>
      </div>

      <div class="right">
        <el-button
          class="btn"
          style="background-color: #1292b9"
          @click="medicine"
        >药历
        </el-button>
        <el-button class="btn" style="background-color: #f59a23" @click="toOut">药品不良反应/事件报告表</el-button>
        <el-button
          class="btn"
          style="background-color: #00bfbf"
          @click="lookHistory">历史药历
        </el-button>
        <el-button
          v-show="form.patientState == 0"
          class="btn"
          style="background-color: #02a7f0"
          @click="leaveHospital"
          v-hasPermi="['workstation:baseInfo:leave']">出院
        </el-button>
      </div>
    </div>
    <div class="" style="display: flex">
      <div class="leftBox">
        <el-collapse v-model="activeNames" @change="handleChange">
          <el-collapse-item title="患者信息" name="1">
            <div
              class="tabText"
              :class="currentIndex == index ? 'active' : ''"
              v-for="(item, index) in list1"
              :key="index"
              @click="tabEvent(index)"
            >
              {{ item.name }}
            </div>
          </el-collapse-item>
          <el-collapse-item title="诊疗信息" name="2">
            <div
              class="tabText"
              :class="currentIndex == index + 3 ? 'active' : ''"
              v-for="(item, index) in list2"
              :key="index"
              @click="tabEvent2(index + 3)"
            >
              {{ item.name }}
            </div>
          </el-collapse-item>
        </el-collapse>
      </div>
      <div class="rightBox">
        <div v-if="currentIndex == 0">
          <!-- 基本信息 -->
          <BasicMessage :id="id"/>
        </div>
        <div v-if="currentIndex == 1">
          <!-- 入院诊断 -->
          <keep-alive>
            <AdmittingDiagnosis :medicalRecodeNo="medicalRecodeNo"/>
          </keep-alive>
        </div>
        <div v-if="currentIndex == 2">
          <!-- 科室 -->
          <keep-alive>
            <ClinicalDepartment :medicalRecodeNo="medicalRecodeNo"/>
          </keep-alive>
        </div>
        <div v-if="currentIndex == 3">
          <div
            v-if="paadmVisitNo"
            v-loading="loadingIframe"
            element-loading-text="正在加载中..."
            element-loading-spinner="el-icon-loading"
            element-loading-background="#fff"
            style="
              width: 100%;
              height: calc(100vh - 190px);
              margin: 0 auto;
              border-radius: 4px;
              overflow: hidden;
            "
          >
            <iframe
              scrolling="auto"
              id="CaseHistory"
              name="CaseHistory"
              :src="bingli"
              frameborder="0"
              style="width: 100%; height: calc(100vh - 190px)"
            ></iframe>
          </div>

          <div v-else>
            <el-empty :image-size="150" description="暂无数据"></el-empty>
          </div>
        </div>
        <template v-if="false">
          <div v-if="currentIndex == 4">
            <iframe
              scrolling="auto"
              id="CaseHistory"
              name="CaseHistory"
              :src="bingli"
              frameborder="0"
              style="width: 100%; height: calc(100vh - 180px)"
            ></iframe>
          </div>
          <div v-if="currentIndex == 5">
            <iframe
              scrolling="auto"
              id="CaseHistory"
              name="CaseHistory"
              :src="bingli"
              frameborder="0"
              style="width: 100%; height: calc(100vh - 180px)"
            ></iframe>
          </div>
        </template>
        <div v-if="currentIndex == 4">
          <div
            v-if="form.sign"
            v-loading="loadingIframe1"
            element-loading-text="正在加载中..."
            element-loading-spinner="el-icon-loading"
            element-loading-background="#fff"
            style="
              width: 100%;
              height: calc(100vh - 190px);
              margin: 0 auto;
              border-radius: 4px;
              overflow: hidden;
            "
          >
            <iframe
              scrolling="auto"
              id="CaseHistory1"
              name="CaseHistory"
              :src="jilu"
              frameborder="0"
              style="width: 100%; height: calc(100vh - 190px)"
            ></iframe>
          </div>

          <div v-else>
            <el-empty :image-size="150" description="暂无数据"></el-empty>
          </div>
        </div>
        <template v-if="false">
          <div v-if="currentIndex == 5">
          </div>
          <div v-if="currentIndex == 6">
          </div>
        </template>
      </div>
    </div>
  </div>
</template>

<script>
import Back from '@/components/Back/index'
import ClinicalDepartment from './view/clinicalDepartment'
import BasicMessage from './view/basicMessage'
import AdmittingDiagnosis from './view/admittingDiagnosis'
import CaseHistory from './view/caseHistory'
import DoctorAdvice from './view/doctorAdvice'
import CheckReport from './view/checkReport'
import Life from './view/life'
import Nursing from './view/nursing'
import BloodGlucose from './view/bloodGlucose'
import iFrame from '@/components/iFrame/index.vue'
import {
  getBaseInfo,
  leave,
  getTicket,
  adr
} from '@/api/workstation/baseInfo'
import { debounce } from '@/utils'

export default {
  data() {
    return {
      activeNames: ['1', '2'],
      currentIndex: 0,
      currentIndex2: undefined,
      list1: [
        {
          name: '基本信息'
        },
        {
          name: '入院诊断'
        },
        {
          name: '科室'
        }
      ],
      list2: [
        {
          name: '病历/医嘱/检验检查',
          path: 'caseHistory'
        },
        {
          name: '生命体征/血糖/护理记录'
        }
      ],
      id: undefined, // 患者ID
      medicalRecodeNo: undefined, // 患者病历号
      paadmVisitNo: '', // 患者HIS系统就诊号
      form: {}, // 患者信息
      loadingIframe: true, // iframe加载状态
      msg: {}, // 患者管理页搜索条件
      loadingIframe1: true, // iframe加载状态
      ptickets: '', // 不良反应跳转参数
      pticketsSRC: '', // 跳转网址
      src: 'http://10.10.12.30:10001/Content/html/index.html?zyh=0002541234&rycs=2&bqdm=105101H&nid=1013&sign=57473de444455c6aec5831a4e38358f5#/medicalNav'
    }
  },
  components: {
    Back,
    ClinicalDepartment,
    BasicMessage,
    AdmittingDiagnosis,
    CaseHistory,
    DoctorAdvice,
    CheckReport,
    Life,
    Nursing,
    BloodGlucose,
    iFrame
  },
  created() {
    this.id = this.$route.query.id
    this.medicalRecodeNo = this.$route.query.medicalRecodeNo
    this.getBaseInfo()
  },
  computed: {
    bingli() {
      return (
        'http://10.10.11.12/imedical/web/form.htm?TPSID=103080200&USERNAME=ys01&EpisodeID=' +
        this.paadmVisitNo
      )
    },
    jilu() {
      return `http://10.10.12.30:10001/Content/html/index.html?zyh=${this.form.medicareNo}&rycs=${this.form.visitTimes}&bqdm=${this.form.medicareWardCode}&nid=1013&sign=${this.form.sign}#/medicalNav`
    },
    pcode() {
      return this.$store.state.user.user.hisUserNo
    },
    useid() {
      return this.$store.state.user.user
    }
  },
  methods: {
    iframeLoad() {
      this.$nextTick(() => {
        const iframe = document.querySelector('#CaseHistory')
        if (iframe.attachEvent) {
          iframe.attachEvent('onload', () => {
            this.loadingIframe = false
          })
        } else {
          iframe.onload = () => {
            this.loadingIframe = false
          }
        }
        setTimeout(() => {
          this.loadingIframe = false
        }, 300)
      })
    },
    iframeLoad1() {
      this.$nextTick(() => {
        const iframe = document.querySelector('#CaseHistory1')
        if (iframe.attachEvent) {
          iframe.attachEvent('onload', () => {
            this.loadingIframe = false
          })
        } else {
          iframe.onload = () => {
            this.loadingIframe = false
          }
        }
        setTimeout(() => {
          this.loadingIframe1 = false
        }, 300)
      })
    },
    // 获取详细信息
    getBaseInfo() {
      getBaseInfo(this.id).then((res) => {
        this.form = res.data
        this.paadmVisitNo = res.data.paadmVisitNo
      })
    },
    handleChange(val) {
      console.log(val)
    },
    tabEvent(index) {
      this.currentIndex = index
    },
    tabEvent2(index) {
      this.currentIndex = index
      if (index == 3 && this.paadmVisitNo) {
        this.iframeLoad()
      } else if (index == 4) {
        this.iframeLoad1()
      }
    },
    // 历史药历
    lookHistory() {
      this.$router.push({
        path: '/historyMedicine',
        query: {
          id: this.id,
          medicalRecordNo: this.medicalRecodeNo
        }
      })
    },
    // 不良反应跳转外部
    toOut: debounce(function() {
      getTicket().then((res) => {
        if (res.code == 200) {
          if (res.msg == '请绑定HIS用户工号') {
            this.$modal.msg(res.msg)
            return
          } else {
            adr(this.useid.userId).then((res) => {
              console.log(res.data)
              var Shell = new ActiveXObject('WScript.Shell')
              try {
                //exe程序所在位置 以及要传的参数，以空格分开
                var print = `C:\\adverseevent\\Browser_Client.exe ${res.data}`
                //print传递参数，1窗口显示方式，true是否等待执行完成
                var rs = Shell.run(print, 1, true)
                Shell = null
              } catch (e) {
                alert('该可执行文件不存在')
              }
            })
          }
        }
      })
    }, 500),

    // 药历
    medicine() {
      // 打开新窗口
      window.open(
        `/medicine?id=${this.id}&medicalRecordNo=${this.medicalRecodeNo}`
      )
    },
    // 出院
    leaveHospital() {
      this.$modal
        .confirm('是否确认' + this.form.patientName + '出院？')
        .then(() => {
          return leave(this.id).then((res) => {
            if (res.code === 200) {
              this.$message({
                type: 'success',
                message: '出院成功'
              })
            } else {
              this.$message({
                type: 'error',
                message: res.msg
              })
            }
          })
        })
        .catch(() => {
        })
        .finally(() => {
        })
    }
  }
}
</script>

<style lang="scss" scoped>
::v-deep .el-collapse-item__header {
  font-family: "Arial Negreta", "Arial Normal", "Arial", sans-serif;
  font-weight: 700;
  font-style: normal;
  font-size: 16px;
  text-align: center;
  line-height: 22px;
  padding-left: 55px;
}

::v-deep .el-collapse-item__wrap {
  border: none;
}

::v-deep .el-collapse {
  border: none;
}

.active {
  background-color: #5ab3ce;
  color: #fff;
}

.headerBox {
  display: flex;
  justify-content: space-between;
  background-color: #fff;

  // margin-bottom: 10px;
  .right {
    display: flex;
    align-items: center;
  }

  .btn {
    color: #fff;
    height: 36px;
  }
}

.leftBox {
  width: 190px;
  height: 606px;
  background: inherit;
  background-color: rgba(255, 255, 255, 1);
  box-sizing: border-box;
  border-width: 1px;
  border-style: solid;
  border-color: rgba(242, 242, 242, 1);
  border-radius: 0px;
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
  box-shadow: none;

  .tabText {
    padding: 8px;
    text-align: center;
    box-sizing: border-box;
    width: 100%;
    font-size: 16px;
    cursor: pointer;
  }
}

.rightBox {
  width: calc(100% - 190px);
  min-height: 594px;
  background: inherit;
  background-color: rgba(255, 255, 255, 1);
  box-sizing: border-box;
  border-width: 1px;
  border-style: solid;
  border-color: rgba(242, 242, 242, 1);
  border-radius: 0px;
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
  box-shadow: none;
  margin-left: 10px;
}

.headTxt {
  font-size: 18px;
  font-weight: 900;
  margin-left: 19px;
}

.value {
  display: inline-block;
  min-width: 100px;
  border-bottom: 1px solid #000;
}
</style>
